<template>
	<view class="fsize-30">
		<!-- 订单状态 -->
		<view class="flex justify-between align-center padding-20 bg-white">
			<text>订单号: {{details.model.orderId}}</text>
			<text class="line-red fweigh-600">{{details.statusText}}</text>
		</view>
		<!-- 卡项信息 -->
		<view class="padding-20 fsize-28 line-gray">联创信息</view>
		<view class="bg-white fsize-30">
			<view class="flex justify-between padding-20 border-b">
				<text class="">名称</text>
				<text class="line-gray">{{details.staff.nickName}}</text>
			</view>
			<view class="flex justify-between padding-20 border-b">
				<text class="">手机号</text>
				<text class="line-gray">{{details.staff.phone}}</text>
			</view>
		</view>
		<!-- 价格 -->
		<view class="padding-20 fsize-28 line-gray">价格</view>
		<view class="bg-white fsize-30">
			<view class="flex justify-between padding-20 border-b">
				<text class="">加盟金额</text>
				<text class="line-red">￥{{details.model.orderAmount}}</text>
			</view>
			<view class="flex justify-between padding-20 border-b">
				<text class="">实付金额</text>
				<text class="line-red">￥{{details.model.orderAmount}}</text>
			</view>
		</view>
		<!-- 时间 -->
		<view class="padding-20 fsize-28 line-gray">时间</view>
		<view class="bg-white fsize-30">
			<view class="flex justify-between padding-20 border-b">
				<text class="">下单时间</text>
				<text class="line-gray">{{details.model.createTime}}</text>
			</view>
			<view class="flex justify-between padding-20">
				<text class="">备注</text>
				<text class="line-gray fsize-26 mt-10">{{details.model.remark?details.model.remark :'无订单留言'}}</text>
			</view>
		</view>
		<view class="bottom-button flex justify-end pt-10" v-if="details.status === 1">
			<view class="ml-20">
				<u-tag text="取消订单" shape="circle" bgColor="#e54d42" borderColor="#e54d42" @click="operate(details.orderId,'cancel')"/>
			</view>
			<view class="ml-20">
				<u-tag 
					text="收款码" 
					shape="circle" 
					bgColor="#e54d42"  
					borderColor="#e54d42" 
					@click="$u.route('pages/payment/qrc', {id:details.orderId, orderType: 11})"
				/>
			</view>
			<view class="ml-20">
				<u-tag text="确认收款" shape="circle" bgColor="#e54d42"  borderColor="#e54d42" @click="operate(details.orderId, 'affirm')"/>
			</view>
		</view>
		<view class="station" :style="details.status === 0?'height: 67px':''"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderId: '',
				details: {}
			}
		},
		onLoad(option) {
			this.orderId = option.id
			this.getDatails()
		},
		methods: {
			getDatails() {
				this.$reqJsonPost('StoreStaffBonusGetDetails', { id: this.orderId }).then(res => {
					this.details = res.data
				})
			},
			operate(rowid, ty){
				let that = this
				uni.showModal({
					title: '提示',
					content: ty==='affirm'?'确认该订单已收款?':'确认取消该订单?',
					success: function (res) {
						if (res.confirm) {
							if(ty === 'cancel'){
								that.$reqJsonPost('CoreCmsProjectOrderCancel', { id: [rowid], orderType: 12 }).then(res=>{
									that.getDatails()
								})
							}else if (ty === 'affirm'){
								that.$reqJsonPost('CoreCmsProjectOrderPay', {
									orderId: rowid,
									paymentCode: 'offline',
									type: 12,
								}).then(res=>{
									that.getDatails()
								})
							}
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.station{
	padding-bottom: 0;  
	padding-bottom: constant(safe-area-inset-bottom);  
	padding-bottom: env(safe-area-inset-bottom);  
}
</style>
